<template>
  <div>
    <div style="border: 1px solid black;width: 200px;height: 300px;margin-left: 600px">
      老师说：<br>
      今天考试客户端<br>
      <div v-for="c in commentList" style="border: 1px solid black;width: 200px;height: 50px">
        <span>{{ c }}</span>
      </div>
      <a @click="commentLook=true">回复</a>
    </div>

    <div v-if="commentLook" style="margin-top: -100px">
      <textarea v-model="content"></textarea><br>
      <input type="button" value="评论" @click="comment()">
    </div>

  </div>
</template>

<script>
export default {
  data() {
    return {
      commentList: [],
      commentLook: false,
      content: "",
    }
  },
  methods: {
    comment() {
      this.commentList.push(this.content);
      this.commentLook = false;
      this.content = "";
    }
  }
}

</script>

<style scoped>

</style>